// @ts-ignore
import ImgCrop from "antd-img-crop";
import React, { useState } from 'react';
import {Avatar, Upload} from 'antd';
import type { RcFile, UploadFile } from 'antd/es/upload/interface';
import {LoadingOutlined, PlusOutlined} from "@ant-design/icons";
interface UploadImgProps {
    customRequest:<Promise>(options:any)=>void;
    avatar:string,
}
const UploadImg: React.FC<UploadImgProps> = (props) => {
    const {customRequest,avatar} = props;
    const onPreview = async (file: UploadFile) => {
        let src = file.url as string;
        if (!src) {
            src = await new Promise((resolve) => {
                const reader = new FileReader();
                reader.readAsDataURL(file.originFileObj as RcFile);
                reader.onload = () => resolve(reader.result as string);
            });
        }
        const image = new Image();
        image.src = src;
        const imgWindow = window.open(src);
        imgWindow?.document.write(image.outerHTML);
    };
    const uploadButton = (
        <div>
            <div style={{ marginTop: 8 }}>Upload</div>
        </div>
    );
    return (
     <>
         <Upload
             name="avatar"
             listType="picture-circle"
             className="avatar-uploader"
             showUploadList={false}
             customRequest={customRequest}
         >
             {avatar ? <Avatar   src={`localhost/file/${avatar}`} style={{ width: '100%',height:'100%' }} /> : uploadButton}
         </Upload>
     </>
    );
};

export default UploadImg;